<template>
  <view class="box-master">
    <view class="box">
      <view v-if="!nowType.listClass">
        {{ nowType.dictLabel||'未定义' }}
      </view>
      <view v-else>
        <u-tag :type="nowType.listClass" :text="nowType.dictLabel"></u-tag>
      </view>
    </view>
  </view>

</template>

<script>
import {getDicts} from "../../api/system/dict/data";

export default {
  name: "DictType",
  props: {
    typeName: {
      type: String,
    },
    value: {
      type: String,
    }
  },
  watch: {
    value() {
      console.log('value', this.value);
      this.getList()
    }
  },
  data() {
    return {
      nowType: {},
      typeList: [],
      columns: [],
    };
  },
  created() {
    this.getList()
  },
  methods: {
    getList() {
      getDicts(this.typeName).then(res => {
        this.typeList = res.data
        this.nowType = this.typeList.find(item => item.dictValue === this.value) || {}
        if ("danger" === this.nowType.listClass) {
          this.nowType.listClass = "error"
        }
        console.log(this.nowType);
      })
    }
  }
}
</script>

<style>
.box-master {
  margin-left: 10rpx;
  display: inline;
}

.box {
  display: inline-block;
}

.type {
  width: 40rpx
}
</style>